<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="js/axios.min.js"></script>
    <script>
    /* 
        window会被添加一个全局的axios方法，该方法可直接用于异步请求操作
        统一方法：axios(config)=>类似于$.ajax()
                参数config=>{异步请求的配置|使用规则的配置}
                    注意：定义请求的必要设置(url)
                返回值Promise对象，所以该方法通过promise状态控制响应操作 
        
        成功响应：
            data:{}由服务器提供的响应结果
            status:200，来自服务器响应的HTTP状态码
            statusText:"OK",来自服务器响应的HTTP状态信息
            headers:{},服务器响应的头，可以被js读取的响应头
            config:{},是为请求提供的配置信息
            request:{}axios发送异步请求的原生请求对象
                
    */

        function send(){
            axios({
                url:"http://127.0.0.1:3000/test/test-all",
                method:"get",
                responseType:"json"//建议响应数据转换格式的配置
            }).then(function(res){
                console.log("请求完成后的相关数据对象：",res);
                console.log("服务器响应数据",res.data);
            }).catch(function(error){
                console.log(error);
                if(error.code=="ERR_NETWORK"){
                    alert("网络中断了");
                }else{
                    switch(error.response.status){
                        case 404:
                            alert("资源不存在");
                            break;
                        case 500:
                            alert("服务器运行异常");
                            break;
                        default:
                            alert("数据请求失败了");
                            break;
                    }
                }
            });
        }
    </script>
</head>
<body>
    <input type="button" value="axios请求get" onclick="send()">
</body>
</html>